<template>
  <el-dialog :visible="visible"
             :title="isUpdate ? '编辑' : '新增'"
             @close="visible = false">
    <el-form class="form">
      <el-form-item label="地块名称">
        <el-input v-model="formData.areaName" />
      </el-form-item>
      <el-form-item label="地块号">
        <el-input v-model="formData.areaNumber"
                  clearable />
      </el-form-item>
      <el-form-item label="备注">
        <el-input v-model="formData.remark" />
      </el-form-item>
    </el-form>
    <el-button @click="visible = false">取 消</el-button>
    <el-button type="primary"
               @click="confirm">确 定</el-button>
  </el-dialog>
</template>

<script>
import { saveArea, updateArea } from '@/api/plant/area'
export default {
  data () {
    return {
      visible: false,
      isUpdate: false,
      formData: {
        id: '',
        areaNumber: '',
        areaName: '',
        plantId: '',
        remark: '',
        companyId:''
      },
    }
  },
  methods: {
    async init (area,companyId) {
      this.visible = true
      if (area != null) {
        this.isUpdate = true
        this.formData = area
        this.setImage(this.formData.companyLicense)
      } else {
        this.isUpdate = false
        this.formData = {
          id: '',
          areaNumber: '',
          areaName: '',
          plantId: '',
          remark: '',
          companyId:companyId
        }
      }
    },
    confirm () {
      if (this.isUpdate) {
        this.handleConform(updateArea, this.formData)
      } else {
        this.handleConform(saveArea, this.formData)
      }
    },
    handleConform (operation) {
      operation(this.formData).then(response => {
        if (response.statusCode == 20000) {
          this.refresh()
          this.visible = false
          this.$message({
            message: '操作成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '发生错误，操作失败',
            type: 'warning'
          })
        }
      })
    },
    refresh () {
      this.$emit('refresh')
    }
  }
}
</script>

<style>
.form {
  margin-bottom: 20px;
}
</style>
